/** JSONP作用：让服务器可以从不同域上获取数据（跨域） */

/** 服务器端 */
const express = require('express');
const app = express();

app.get('/jsonp', (req, res) => {
  const callback = req.query.callback; // 前端传入的回调函数名
  if (!callback) return res.status(400).send('Missing callback');

  // 动态生成数据（这里是模拟数据库数据）
  const user = {
    name: 'Tom',
    age: Math.floor(Math.random() * 30 + 20), // 动态年龄
    time: new Date().toLocaleTimeString()     // 动态时间
  };

  // 返回一段 JS：调用前端函数
  res.setHeader('Content-Type', 'application/javascript');
  // 调用了回调函数
  res.send(`${callback}(${JSON.stringify(user)})`);
});

app.listen(3000, () => {
  console.log('JSONP server running on http://localhost:3000');
});


/** 前端代码 */
function handleRes(data) {
    console.log("拿到的数据：", data);
    document.body.innerHTML += `<p>姓名: ${data.name}, 年龄: ${data.age}, 时间: ${data.time}</p>`;
  }

  function loadJSONP() {
    const script = document.createElement('script');
    script.src = `http://localhost:3000/jsonp?callback=handleRes`;
    document.body.appendChild(script);
  }

  // 模拟定时加载动态数据
  setInterval(loadJSONP, 3000);
